import 'package:flutter/material.dart';

import '../model/profile_mo.dart';
import '../util/view_util.dart';

///职场进阶
class CourseCard extends StatelessWidget {
  final List<Course> courseList;

  const CourseCard({super.key, required this.courseList});

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.only(left: 10, right: 5, top: 15),
      child: Column(
        children: [_buildTitle(), ..._buildCardList(context)],
      ),
    );
  }

  _buildTitle() {
    return Container(
        padding: const EdgeInsets.only(bottom: 10),
        child: Row(
          children: [
            const Text('职场进阶', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),
            hiSpace(width: 10),
            Text('带你突破技术瓶颈', style: TextStyle(fontSize: 12, color: Colors.grey[600]))
          ],
        ));
  }

  ///动态布局
  _buildCardList(BuildContext context) {
    var courseGroup = {};
    //将课程进行分组
    for (var course in courseList) {
      if (!courseGroup.containsKey(course.group)) {
        courseGroup[course.group] = [];
      }
      courseGroup[course.group].add(course);
    }
    return courseGroup.entries.map((item) {
      // 获取map的列表数据
      List list = item.value;
      //根据卡片数量计算出每个卡片的宽度
      var width = (MediaQuery.of(context).size.width - 20 - (list.length - 1) * 5) / list.length;
      var height = width / 16 * 6;
      return Row(
        children: [
          ...list.map((item) {
            return _buildCard(item, width, height);
          })
        ],
      );
    }).toList();
  }

  _buildCard(Course item, double width, double height) {
    return InkWell(
      onTap: () {},
      child: Padding(
        padding: const EdgeInsets.only(right: 5, bottom: 7),
        child: ClipRRect(
          borderRadius: BorderRadius.circular(5),
          child: Stack(
            alignment: Alignment.center,
            children: [
              cachedImage(item.cover, width: width, height: height),
              Text(
                item.name,
                style: const TextStyle(fontSize: 18, color: Colors.white),
              )
            ],
          ),
        ),
      ),
    );
  }
}
